# Truncate String

## Installation
`npm i @snack-uikit/truncate-string`

[Changelog](./CHANGELOG.md)

## Example 

```typescript jsx
<TruncateString
  variant='end'
  placement='top'
  hideTooltip={true}
  text={'Текст'}
  maxLines={2}
/>
```

[//]: DOCUMENTATION_SECTION_START
[//]: THIS_SECTION_IS_AUTOGENERATED_PLEASE_DONT_EDIT_IT
## TruncateString
### Props
| name | type | default value | description |
|------|------|---------------|-------------|
| text* | `string` | - | Текст, который будет обрезаться |
| variant | "middle" \| "end" | end | Вариант обрезания строки: <br> - `End` - с конца <br> - `Middle` - по середине |
| className | `string` | - | CSS-класс |
| hideTooltip | `boolean` | - | Скрывать ли тултип с полным текстом |
| maxLines | `number` | - | Максимальное кол-во строк, до которого может сворачиваться текст. |
| placement | enum Placement: `"left"`, `"left-start"`, `"left-end"`, `"right"`, `"right-start"`, `"right-end"`, `"top"`, `"top-start"`, `"top-end"`, `"bottom"`, `"bottom-start"`, `"bottom-end"` | - | Положение тултипа относительно обрезанного текста. |


[//]: DOCUMENTATION_SECTION_END

## Troubleshooting

Если компонент работает некорректно, проверь:
* `<TruncateString />` должен лежать в органиченном по ширине контейнере,
  иначе он не сможет правильно высчитывать обрезание.
* если с ограничением по ширине тоже возникают проблемы, можно попробовать 
  задать на компоненте-обёртке св-во display: grid 
